import  { createContext, useContext, useEffect, useState } from 'react'
const Context=createContext({})
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const ThemeContext=({children}:{children:any})=>{

  const [theme] = useState(localStorage.getItem('theme') || 'light')
  useEffect(() => {
    handleChange(theme)
  }, [])
  const handleChange = (value: string) => {
    console.log(`selected ${value}`);
    localStorage.setItem('theme', value)
    document.documentElement.setAttribute('data-t', value)
  };
  return (
    <Context.Provider value={{theme,handleChange}}>
      {children}
    </Context.Provider>
  )
}
const useTheme=()=>useContext(Context)
export default useTheme
